<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>停车券设置</title>
    <link rel="stylesheet" href="${ctx}/static/plug/frozenui-1.3.0/css/frozen.css" media="all">
    <style type="text/css">
        .content {
            padding-left: 20px;
            padding-right: 20px;
            margin-top: 20px;
        }

        .div-content {
            width: 100%;
            margin-top: 10px;
            padding-bottom: 5px;
            padding-top: 10px;
            background-color: #469fe3;
            color: white;
            border-radius: 3px;
        }
    </style>
</head>
<body>


<section class="ui-container">
    <div class="ui-flex  ui-flex-ver ui-flex-pack-center content" id="moneyDetailDiv">


        <c:if test="${shopCoupons != null &&  fn:length(shopCoupons) > 0 }">
            <c:forEach var="shopCoupon" items="${shopCoupons}">
                <div class="div-content" id="div-shop-coupon-${shopCoupon.id}">
                    <ul class="ui-row-flex">
                        <li class="ui-col  ui-col-3">
                            <div class=""
                                 style="padding-top: 0px; padding-bottom: 10px; padding-left: 15px; width: 100%">
                                <h2 style="font-size: 25px;">￥
                                    <fmt:formatNumber type="number" value="${shopCoupon.money }"
                                                      pattern="0.00" maxFractionDigits="2"/>
                                </h2>
                                <h1 style="font-size: 15px;">${shopCoupon.typeDesc}</h1>
                            </div>
                        </li>
                        <li class="ui-col" style="padding-right: 15px" align="right">
                            <i class="ui-icon-delete" style="padding-top: 10px"
                               onclick="confirmDelCarNo('${shopCoupon.id}')"></i>
                        </li>
                    </ul>
                </div>
            </c:forEach>
        </c:if>


    </div>
    <div class="ui-footer ui-footer-stable ui-btn-group ui-border-t" onclick="funcAddCarNo()"
         style="background-color: #FFF">
        <div style="text-align: center; width: 100%; " onclick="funcNewCoupon()">新增停车券</div>
    </div>
</section>

<section id="dialog">
    <div class="demo-block">
        <div class="ui-dialog">
            <div class="ui-dialog-cnt" style="width:80%">
                <header class="ui-dialog-hd ui-border-b">
                    <h1 class="ui-icon-info"></h1>
                </header>
                <div class="ui-dialog-bd">
                    <div id="confirmMessage">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;确认要删除该停车券吗?</div>
                </div>
                <div class="ui-dialog-ft">
                    <button type="button" id="btnConfirm" data-role="button">确定</button>
                    <button type="button" id="btnCancel" data-role="button">取消</button>
                </div>
            </div>
        </div>
    </div>
</section>

</body>
<script src="${ctx}/static/plug/frozenui-1.3.0/lib/zepto.min.js"></script>
<script src="${ctx}/static/plug/frozenui-1.3.0/js/frozen.js"></script>
<script>

    var paramObj = {
        "newShopCouponParams": "${newShopCouponParams}",
        "delShopCouponParams": "${delShopCouponParams}"
    };

    $(function () {
        $("#btnCancel").click(function () {
            $(".ui-dialog").removeClass("show");
        });
    });

    function confirmDelCarNo(couponId) {

        $(".ui-dialog").addClass("show");
        $("#btnConfirm").bind("click", function () {
            deleteShopCoupon(couponId);
        });
    }

    var canDelete = true;
    function deleteShopCoupon(couponId) {
        if (canDelete) {
            console.log("couponId:" + couponId);
            var param = {
                "params": paramObj.delShopCouponParams,
                "couponId": couponId,
            };
            canDelete = false;
            $.post("${action}", param, function (obj) {
                $(".ui-dialog").removeClass("show");
                if (obj.result) {
                    showTips("info", "删除成功");
                    $("#div-shop-coupon-" + couponId).remove();
                } else {
                    $("#showMsgP").html(obj.msg);
                }
                canDelete = true;
            });
        }
    }

    function funcNewCoupon() {
        var hrefUrl = "${action}?params=" + paramObj.newShopCouponParams;
        window.location.href = hrefUrl;
    }

</script>
</html>
